import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:leader_help/utils/colors_util.dart';
import 'package:leader_help/utils/component/component.dart';
import 'package:leader_help/utils/img_util.dart';
import 'package:leader_help/value/topcolors.dart';

import 'key_point_big_logic.dart';

class KeyPointBigPage extends StatefulWidget {
  const KeyPointBigPage({Key? key}) : super(key: key);

  @override
  _KeyPointBigPageState createState() => _KeyPointBigPageState();
}

class _KeyPointBigPageState extends State<KeyPointBigPage> {
  final logic = Get.put(KeyPointBigLogic());
  final state = Get.find<KeyPointBigLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: detailAppBar(context, title: "宏观问题"),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Container(
              width: Get.width,
              padding: EdgeInsets.only(left: 20.r, top: 10.r, right: 15.r, bottom: 10.r),
              decoration: const BoxDecoration(
                color: ColorsUtil.bg,
              ),
              child: Text("3项宏观问题待解决", style: TextStyle(color: TopColors.greenBg, fontSize: 15),),
            ),
            Container(
              // width: Get.width,
              margin: EdgeInsets.only(top: 5.r),
              padding: EdgeInsets.only(left: 10.r, top: 10.r, right: 10.r, bottom: 10.r),
              decoration: const BoxDecoration(
                color: ColorsUtil.bg,
              ),
              child:
              ListView.builder(
                shrinkWrap: true, //解决无线高度问题 解决SingleChildScrollView 和listview冲突问题 ListView.builder
                itemCount: state.title.length,
                physics: const BouncingScrollPhysics(),
                itemBuilder: (BuildContext context, int index) {
                  return pointShowListItem(state.title[index]);
                }
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<KeyPointBigLogic>();
    super.dispose();
  }

  /// 折叠面板
  Widget pointShowListItem(String title) {
    return Container(
      margin: const EdgeInsets.only(top: 3, bottom: 3),
      padding: EdgeInsets.only(left: 10.r, right: 10.r),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(5.r),
      ),
      child: Column(
        children: <Widget>[
          ExpansionPanelList(
            elevation: 0,
            children : <ExpansionPanel>[
              ExpansionPanel(
                headerBuilder:(context, isExpanded) {
                  return Container(
                    width: Get.width,
                    padding: EdgeInsets.only(left: 10.r, top: 10.r, right: 10.r, bottom: 10.r),
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(5.r),
                    ),
                    child: Text(title, style: TextStyle(color: TopColors.main_red, fontSize: 15),),
                  );
                },
                body: Padding(
                  padding: const EdgeInsets.fromLTRB(0, 0, 0, 15),
                  child: ListBody(
                    children: [
                      Divider(color: TopColors.gray_line, height: 1,),
                      Column(
                        children: [
                          Container(
                            margin:EdgeInsets.fromLTRB(15.r, 10.r, 15.r, 10.r),
                            child: Row(
                              children: [
                                Container(
                                  margin: EdgeInsets.only(right: 5.r),
                                  width: 3.r,
                                  height: 15.r,
                                  color: TopColors.main_red,
                                ),
                                Text('问题描述', style: TextStyle(color: TopColors.black_33,fontSize: 15),),
                              ],
                            ),
                          ),
                          Container(
                            margin:EdgeInsets.only(left: 15.r, top: 5.r, right: 15.r),
                            child: Text("未充分考虑受市场资本青睐的企业，需集中力量帮扶此类型企业。",
                              style: TextStyle(color: TopColors.black_66, fontSize: 14),),
                          ),
                          Container(
                            width: Get.width,
                            alignment: Alignment.center,
                            padding: EdgeInsets.only(top: 2.r, bottom: 4.r),
                            margin:EdgeInsets.only(left: 15.r, top: 15.r, right: 15.r),
                            decoration: BoxDecoration(
                              border: Border.all(color: TopColors.main_red, width: 1),
                              borderRadius: BorderRadius.circular(5.r),
                            ),
                            child: Text("查看企业分布",
                              style: TextStyle(color: TopColors.black_33, fontSize: 13),),
                          ),
                          Container(
                            margin:EdgeInsets.fromLTRB(15.r, 25.r, 15.r, 10.r),
                            child: Row(
                              children: [
                                Container(
                                  margin: EdgeInsets.only(right: 5.r),
                                  width: 3.r,
                                  height: 15.r,
                                  color: TopColors.main_red,
                                ),
                                Expanded(child: Text('外省做法', style: TextStyle(color: TopColors.black_33,fontSize: 15),)),
                                InkWell(
                                  child: Row(
                                    children: [
                                      Text("更多", style: TextStyle(color: TopColors.black_66, fontSize: 14),),
                                      Icon(Icons.arrow_forward_ios, size: 13, color: TopColors.black_66,)
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                          ListView.builder(
                            shrinkWrap: true, //解决无线高度问题 解决SingleChildScrollView 和listview冲突问题 ListView.builder
                            itemCount: 3,
                            physics: const BouncingScrollPhysics(),
                            itemBuilder: (BuildContext context, int index) {
                              return workListItem(state.province[index], state.content[index]);
                            }
                          ),
                          Container(
                            margin:EdgeInsets.fromLTRB(15.r, 25.r, 15.r, 10.r),
                            child: Row(
                              children: [
                                Container(
                                  margin: EdgeInsets.only(right: 5.r),
                                  width: 3.r,
                                  height: 15.r,
                                  color: TopColors.main_red,
                                ),
                                Expanded(child: Text('智库专家', style: TextStyle(color: TopColors.black_33,fontSize: 15),)),
                                InkWell(
                                  child: Row(
                                    children: [
                                      Text("更多", style: TextStyle(color: TopColors.black_66, fontSize: 14),),
                                      Icon(Icons.arrow_forward_ios, size: 13, color: TopColors.black_66,)
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                          ListView.builder(
                              shrinkWrap: true, //解决无线高度问题 解决SingleChildScrollView 和listview冲突问题 ListView.builder
                              itemCount: state.name.length,
                              physics: const BouncingScrollPhysics(),
                              itemBuilder: (BuildContext context, int index) {
                                return panelListItem(index == 0 ? true : false, state.name[index], state.position[index], state.research[index]);
                              }
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
                isExpanded: logic.isExpanded,
                canTapOnHeader: true,
              ),

            ],
            expansionCallback:(panelIndex, isExpanded){
              setState(() {
                logic.isExpanded = !isExpanded;
              });
            },
            animationDuration : kThemeAnimationDuration,
          ),
        ],
      ),
    );
  }

  /// 外省做法 list item
  Widget workListItem (String province, String content) {
    return Container(
      margin:EdgeInsets.fromLTRB(15.r, 5.r, 15.r, 5.r),
      decoration: BoxDecoration(
        color: TopColors.gray_line,
        borderRadius: BorderRadius.circular(5.r),
      ),
      child: Container(
        margin:EdgeInsets.all(2.r),
        padding: EdgeInsets.all(5.r),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(5.r),
        ),
        child: Row(
          children: [
            Expanded(
              child: RichText(
                text: TextSpan(
                    children: [
                      WidgetSpan(
                        child: Container(
                          decoration: BoxDecoration(
                            border: Border.all(color: TopColors.top_ju, width: 1),
                            borderRadius: BorderRadius.circular(2.r),
                          ),
                          child: Text(province, style: TextStyle(color: TopColors.top_ju, fontSize: 11),),
                        ),
                      ),
                      WidgetSpan(
                        child: SizedBox(width: 5.r,),
                      ),
                      TextSpan(text: content, style: TextStyle(color: TopColors.black_33, fontSize: 14,),)
                    ]
                ),
              ),
            ),
            Icon(Icons.arrow_forward_ios, size: 14, color: TopColors.black_33,)
          ],
        ),
      ),
    );
  }

  /// 智库专家
  Widget panelListItem (bool visible, String name, String position, String research) {
    return Container(
      margin:EdgeInsets.fromLTRB(15.r, 5.r, 15.r, 5.r),
      decoration: BoxDecoration(
        color: TopColors.gray_line,
        borderRadius: BorderRadius.circular(5.r),
      ),
      child: Container(
        margin:EdgeInsets.all(2.r),
        padding: EdgeInsets.all(5.r),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(5.r),
        ),
        child: Stack(
          children: [
            Visibility(
              visible: visible,
              child:
                Align(alignment: Alignment.topRight, child: Image.asset("download.png".imgPathTask, height: 30.r),
              ),
            ),
            Column(
              children: [
                Row(
                  children: [
                    Image.asset("avatar_default.png".imgPathMe, height: 35.r,),
                    SizedBox(width: 5.r,),
                    Text(name, style: TextStyle(color: TopColors.black_33, fontSize: 14),),
                    SizedBox(width: 8.r,),
                    Flexible(
                      child: Text(
                        position,
                        style: TextStyle(color: TopColors.black_66, fontSize: 13),
                        maxLines: 2,
                        softWrap: true,
                        overflow: TextOverflow.ellipsis,
                      ),
                    )
                  ],
                ),
                Row(
                  children: [
                    Text("研究领域：", style: TextStyle(color: TopColors.black_66, fontSize: 13),),
                    Text(research, style: TextStyle(color: TopColors.main_red, fontSize: 13),)
                  ],
                ),
                SizedBox(height: 10.r,),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: [
                    Container(
                      alignment: Alignment.center,
                      padding: EdgeInsets.only(left: 20.r, right: 20.r, top: 2.r, bottom: 4.r),
                      margin:EdgeInsets.only(left: 20.r),
                      decoration: BoxDecoration(
                        border: Border.all(color: TopColors.main_red, width: 1),
                        borderRadius: BorderRadius.circular(5.r),
                      ),
                      child: Text("他的观点",
                        style: TextStyle(color: TopColors.black_33, fontSize: 13),),
                    ),
                    Container(
                      alignment: Alignment.center,
                      padding: EdgeInsets.only(left: 20.r, right: 20.r, top: 2.r, bottom: 4.r),
                      margin:EdgeInsets.only(right: 20.r),
                      decoration: BoxDecoration(
                        border: Border.all(color: TopColors.main_red, width: 1),
                        borderRadius: BorderRadius.circular(5.r),
                      ),
                      child: Text("委托课题",
                        style: TextStyle(color: TopColors.black_33, fontSize: 13),),
                    ),

                  ],
                ),
              ],
            )
          ],
        ),
      ),
    );
  }

}